<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet"
	href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script
	src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="layui.js"></script>
<link rel="stylesheet" href="css/layui.css" media="all">
</head>
<body>

	<h2 class="sub-header">请填写要新增的回答</h2>
	<hr/>
		<form class="form-horizontal" role="form"
			action="${pageContext.request.contextPath}/ab?op=insert"
			method="post">

			<div class="form-group">
				<label for="content" class="col-sm-2 control-label">请输入要增加的回答</label>
				<div class="col-sm-8">
					<input type="text" required="required" class="form-control"
						name="content" id="content" value="" />
				</div>
			</div>
			<div class="form-group">
				<label for="adate" class="col-sm-2 control-label">请输入要增加的时间</label>
				<div class="col-sm-8">
					<input type="text" class="layui-input" id="adate" name="adate"
						placeholder="请输入年月日">
				</div>
			</div>

			<div class="form-group">
				<label for="userId" class="col-sm-2 control-label">请输入要修改的回答者</label>
				<div class="col-sm-4">
					<select class="form-control" name="userId" id="userId">

					</select>
				</div>
			</div>
			<div class="form-group">
				<label for="qid" class="col-sm-2 control-label">请输入要修改的问题</label>
				<div class="col-sm-4">
					<select class="form-control" name=qid id="qid">

					</select>
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-5 col-sm-1">
					<button type="submit" style="width: 100px;" class="btn btn-danger">提交</button>
				</div>
			</div>
		</form>
	<script type="text/javascript">
		$(function() {
			//ajax的 get请求
			$.get("UserServlet?op=queryUser", function(data, status) {
				//将返回值转化为数组格式
				array = JSON.parse(data);
				//遍历数组
				$.each(array, function(index, user) {
					//在#userId出添加标签元素
					$("#userId").append(
							"<option value="+user.userId+">" + user.userName
									+ "</option>");
				});
			});
		});
		$(function() {
			//ajax的 get请求
			$.get("qs?op=queryQuestion", function(data, status) {
				//将返回的值转化为数组
				array = JSON.parse(data);
				//遍历数组
				$.each(array, function(index, question) {
					//在指定标签增加标签元素
					$("#qid").append(
							"<option value="+question.qId+">" + question.qTitle
									+ "</option>");
					console.log(question.qId);
				});
			});
		});
	</script>
	<script>
	    //使用layui插件将选择日期变美观
		layui.use('laydate', function() {
			var laydate = layui.laydate;

			//常规用法
			laydate.render({
				elem : '#adate',
				type : 'datetime'
			});
		});
	</script>
</body>
</html>